<form id="edit-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="">

    <div class="panel panel-default panel-intro">
        <div class="panel-heading">
            <ul class="nav nav-tabs">
                <li class="active"><a href="#first" data-toggle="tab">{:__('BasicData')}</a></li>
                <li><a href="#second" data-toggle="tab">{:__('GoodsInfo')}</a></li>
                <li id="tab-three" {if ($row.type == 1)}style="display: none;"{/if}><a href="#three" data-toggle="tab">{:__('Gift')}</a></li>
            </ul>
        </div>
        <div class="panel-body">
            <div id="myTabContent" class="tab-content">
                <div class="tab-pane fade active in" id="first">

                    <div class="form-group">
                        <label class="control-label col-xs-12 col-sm-2">{:__('Type')}:</label>
                        <div class="col-xs-12 col-sm-8">

                            <select  id="c-type" class="form-control selectpicker" onchange="typechange()" name="row[type]">
                                {foreach name="typeList" item="vo"}
                                <option value="{$key}" {in name="key" value="$row.type"}selected{/in}>{$vo}</option>
                                {/foreach}
                            </select>

                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-xs-12 col-sm-2">{:__('Activity_name')}:</label>
                        <div class="col-xs-12 col-sm-8">
                            <input id="c-activity_name" class="form-control" name="row[activity_name]" type="text" value="{$row.activity_name|htmlentities}">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-xs-12 col-sm-2">{:__('Label')}:</label>
                        <div class="col-xs-12 col-sm-8">
                            <input id="c-label" class="form-control" name="row[label]" type="text" value="{$row.label|htmlentities}">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-xs-12 col-sm-2">{:__('Start_time')}:</label>
                        <div class="col-xs-12 col-sm-8">
                            <input id="c-start_time" class="form-control datetimepicker" data-date-format="YYYY-MM-DD HH:mm:ss" data-use-current="true" name="row[start_time]" type="text" value="{:$row.start_time?datetime($row.start_time):''}">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-xs-12 col-sm-2">{:__('End_time')}:</label>
                        <div class="col-xs-12 col-sm-8">
                            <input id="c-end_time" class="form-control datetimepicker" data-date-format="YYYY-MM-DD HH:mm:ss" data-use-current="true" name="row[end_time]" type="text" value="{:$row.end_time?datetime($row.end_time):''}">
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="control-label col-xs-12 col-sm-2">{:__('Status')}:</label>
                        <div class="col-xs-12 col-sm-8">

                            <div class="radio">
                                {foreach name="statusList" item="vo"}
                                <label for="row[status]-{$key}"><input id="row[status]-{$key}" name="row[status]" type="radio" value="{$key}" {in name="key" value="$row.status"}checked{/in} /> {$vo}</label>
                                {/foreach}
                            </div>

                        </div>
                    </div>

                    <div class="form-group">
                        <label class="control-label col-xs-12 col-sm-2">{:__('Rule')}:</label>
                        <div class="col-xs-12 col-sm-8">
                            <table class="table fieldlist" data-template="basictpl" data-name="row[rule]" id="first-table">
                                <tr>
                                    <td>{:__('rank')}</td>
                                    <td>{:__('reward')}</td>
                                    <td width="100"></td>
                                </tr>
                                <tr>
                                    <td colspan="5"><a href="javascript:;" class="btn btn-sm btn-success btn-append"><i class="fa fa-plus"></i> {:__('Append')}</a></td>
                                </tr>
                            </table>

                            <!--请注意实际开发中textarea应该添加个hidden进行隐藏-->
                            <textarea name="row[rule]" class="form-control hidden" cols="30" rows="5">{$row.rule|htmlentities}</textarea>
                            <script id="basictpl" type="text/html">
                                <tr class="form-inline">
                                    <td><input type="number" name="<%=name%>[<%=index%>][rank]" class="form-control" size="15" value="<%=row.rank%>" placeholder=""/></td>
                                    <td><input type="number" name="<%=name%>[<%=index%>][reward]" class="form-control" size="15" value="<%=row.reward%>" placeholder=""/></td>
                                    <td>
                                        <!--下面的两个按钮务必保留-->
                                        <span class="btn btn-sm btn-danger btn-remove"><i class="fa fa-times"></i></span>
                                        <span class="btn btn-sm btn-primary btn-dragsort"><i class="fa fa-arrows"></i></span>
                                    </td>
                                </tr>
                            </script>
                        </div>
                    </div>

                </div>

                <div class="tab-pane fade" id="second">

                    <div class="form-group">
                        <label class="control-label col-xs-12 col-sm-2">{:__('Goods_ids')}:</label>
                        <div class="col-xs-12 col-sm-8">
                            <div class="input-group">
                                <input id="c-title" class="form-control" name="row[goods_ids]" type="hidden" value="{$row.goods_ids|htmlentities}">
                                <div class="input-group-addon no-border no-padding">
                                <span><button type="button" id="litestoregoods-title"
                                              data-url="litestore/litestoregoods/select" data-maxcount="30000" data-admin-id="1"
                                              class="btn btn-success fachoosegoodsfull" data-input-goodsid="c-title"
                                              data-multiple="true"><i class="fa fa-list"></i> {:__('Choose Table')}
                                 </button></span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-group" id="target">
                        <label class="control-label col-xs-12 col-sm-2">{:__('Selected')}:</label>
                        <div class="col-xs-12 col-sm-8">
                            <table id="table" class="table table-striped table-bordered table-hover table-nowrap" width="100%">
                                <thead>
                                <tr>
                                    <th style="text-align: center; vertical-align: middle; " data-field="goods_id">
                                        <div class="th-inner ">{:__('GoodsId')}</div>
                                        <div class="fht-cell"></div>
                                    </th>
                                    <th style="text-align: center; vertical-align: middle; " data-field="goods_name">
                                        <div class="th-inner ">{:__('Goods_name')}</div>
                                        <div class="fht-cell"></div>
                                    </th>
                                    <th style="text-align: center; vertical-align: middle; " data-field="pro_no">
                                        <div class="th-inner ">{:__('Pro_no')}</div>
                                        <div class="fht-cell"></div>
                                    </th>
                                    <th style="text-align: center; vertical-align: middle; " data-field="images">
                                        <div class="th-inner ">{:__('Image')}</div>
                                        <div class="fht-cell"></div>
                                    </th>
                                    <th style="text-align: center; vertical-align: middle; " data-field="goods_price">
                                        <div class="th-inner ">{:__('Goods_price')}</div>
                                        <div class="fht-cell"></div>
                                    </th>
                                    <th style="text-align: center; vertical-align: middle; ">
                                        <div class="th-inner ">{:__('Operate')}</div>
                                        <div class="fht-cell"></div>
                                    </th>
                                </tr>
                                </thead>
                                <tbody data-listidx="0" id="targetTr">

                                {foreach name="$row.goods_info" item="vo"}
                                <tr data-index={$key}>
                                    <td style="text-align: center; vertical-align: middle; ">{$vo.goods_id}<input class="goods_info" name="row[goods_info][{$vo.goods_id}]" type="hidden" value="{$vo.goods_id}"></td>
                                    <td style="text-align: center; vertical-align: middle; ">{$vo.goods_name}</td>
                                    <td style="text-align: center; vertical-align: middle; ">{$vo.pro_no}</td>
                                    <td style="text-align: center; vertical-align: middle; "><img class="img-sm img-center" src="{$vo.images}"></td>
                                    <td style="text-align: center; vertical-align: middle; ">{$vo.goods_price}</td>
                                    <td style="text-align: center; vertical-align: middle; "><a href="#" onclick="del(this)">删除</a></td>
                                </tr>
                                {/foreach}

                                </tbody>
                            </table>
                        </div>
                    </div>

                </div>

                <div class="tab-pane fade" id="three">

                    <div class="form-group">
                        <label class="control-label col-xs-12 col-sm-2">{:__('GiftGoodsids')}:</label>
                        <div class="col-xs-12 col-sm-8">
                            <div class="input-group">
                                <input id="c-title-sku" class="form-control" name="row[goods_ids_gift]" type="hidden" value="">
                                <div class="input-group-addon no-border no-padding">
                                <span><button type="button" id="litestoregoods-title-sku"
                                              data-url="litestore/litestoregoods/select_sku" data-maxcount="30000" data-admin-id="1"
                                              class="btn btn-success fachoosegoodssku" data-input-goodsid="c-title-sku"
                                              data-multiple="true"><i class="fa fa-list"></i> {:__('Choose Table')}
                                 </button></span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-group" id="targetSku">
                        <label class="control-label col-xs-12 col-sm-2">{:__('Selected')}:</label>
                        <div class="col-xs-12 col-sm-8">
                            <table id="tableSku" class="table table-striped table-bordered table-hover table-nowrap" width="100%">
                                <thead>
                                <tr>
                                    <th style="text-align: center; vertical-align: middle; " data-field="goods_id">
                                        <div class="th-inner ">{:__('GoodsId')}</div>
                                        <div class="fht-cell"></div>
                                    </th>
                                    <th style="text-align: center; vertical-align: middle; " data-field="goods_name">
                                        <div class="th-inner ">{:__('Goods_name')}</div>
                                        <div class="fht-cell"></div>
                                    </th>
                                    <th style="text-align: center; vertical-align: middle; " data-field="pro_no">
                                        <div class="th-inner ">{:__('Pro_no')}</div>
                                        <div class="fht-cell"></div>
                                    </th>
                                    <th style="text-align: center; vertical-align: middle; " data-field="images">
                                        <div class="th-inner ">{:__('Image')}</div>
                                        <div class="fht-cell"></div>
                                    </th>
                                    <th style="text-align: center; vertical-align: middle; " data-field="sku_text">
                                        <div class="th-inner ">{:__('Sku')}</div>
                                        <div class="fht-cell"></div>
                                    </th>
                                    <th style="text-align: center; vertical-align: middle; " data-field="goods_price">
                                        <div class="th-inner ">{:__('Goods_price')}</div>
                                        <div class="fht-cell"></div>
                                    </th>
                                    <th style="text-align: center; vertical-align: middle; ">
                                        <div class="th-inner ">{:__('Operate')}</div>
                                        <div class="fht-cell"></div>
                                    </th>
                                </tr>
                                </thead>
                                <tbody data-listidx="0" id="targetTrSku">
                                    {foreach name="$row.goods_info_gift" item="vo"}
                                    <tr data-index={$key}>
                                        <td style="text-align: center; vertical-align: middle; ">{$vo.goods_id}<input class="goods_info_gift" name="row[goods_info_gift][{$vo.goods_spec_id}]" type="hidden" value="{$vo.goods_spec_id}"></td>
                                        <td style="text-align: center; vertical-align: middle; ">{$vo.goods_name}</td>
                                        <td style="text-align: center; vertical-align: middle; ">{$vo.pro_no}</td>
                                        <td style="text-align: center; vertical-align: middle; "><img class="img-sm img-center" src="{$vo.images}"></td>
                                        <td style="text-align: center; vertical-align: middle; ">{$vo.sku_text}</td>
                                        <td style="text-align: center; vertical-align: middle; ">{$vo.goods_price}</td>
                                        <td style="text-align: center; vertical-align: middle; "><a href="#" onclick="del1(this)">删除</a></td>
                                    </tr>
                                    {/foreach}
                                </tbody>
                            </table>
                        </div>
                    </div>

                </div>

            </div>
        </div>
    </div>

    <div class="form-group layer-footer">
        <label class="control-label col-xs-12 col-sm-2"></label>
        <div class="col-xs-12 col-sm-8">
            <button type="submit" class="btn btn-primary btn-embossed disabled">{:__('OK')}</button>
            <button type="reset" class="btn btn-default btn-embossed">{:__('Reset')}</button>
        </div>
    </div>
</form>
<script>
    function typechange() {
        var type=$("#c-type").val();
        if(type == 1){
            $('#tab-three').css('display','none');
        }else{
            $('#tab-three').css('display','block');
        }
    }
    function del(obj){
        obj.parentNode.parentNode.remove();

        var goods_ids = '';
        $('.goods_info').each(function(){
            var goods_id= $(this).val();
            goods_ids += goods_id + ',';
        })
        goods_ids = goods_ids.slice(0,-1);
        $("#c-title").val(goods_ids).trigger("change")
            .trigger("validate");
    }
    function del1(obj){
        obj.parentNode.parentNode.remove();

        var goods_spec_ids = '';
        $('.goods_info_gift').each(function(){
            var goods_spec_id= $(this).val();
            goods_spec_ids += goods_spec_id + ',';
        })
        goods_spec_ids = goods_spec_ids.slice(0,-1);
        $("#c-title-sku").val(goods_spec_ids).trigger("change")
            .trigger("validate");
    }
</script>
